import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

//跳转时显示进度条
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

// 引入element-ui
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';

//全局样式
import './assets/globalcss/global.css'

//引入axios
import axios from './request/axios'
//挂载axios
Vue.prototype.$axios = axios

//全局注册element-ui
Vue.use(ElementUI)
Vue.config.productionTip = false

Vue.config.devtools = true

new Vue({
  router,
  store,
  render: function (h) { return h(App) }
}).$mount('#app')

NProgress.configure({
  easing: 'ease', // 动画方式 
  speed: 500, // 递增进度条的速度 
  showSpinner: false, // 是否显示加载ico 
  trickleSpeed: 200, // 自动递增间隔 
  minimum: 0.3 // 初始化时的最小百分比
})

//当路由进入前
router.beforeEach((to, from, next) => {
  // 每次切换页面时，调用进度条
  NProgress.start();
  // 若加载时间长且不定，担心进度条走完都没有加载完，可以调用
  NProgress.inc(); //这会以随机数量递增，且永远达不到100%，也可以设指定增量
  next();
});
//当路由进入后：关闭进度条
router.afterEach(() => {
  // 在即将进入新的页面组件前，关闭掉进度条
  NProgress.done()
})